package be.felnederlands.client.content.home;

import be.felnederlands.client.content.widgets.CommentAnchor;
import be.felnederlands.client.content.widgets.HPanel;
import be.felnederlands.client.content.widgets.PPanel;

import com.google.gwt.dom.client.DivElement;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Anchor;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.Label;

public class WordPanel extends Composite implements ClickHandler{

	/*
	 * <div class="span4">
	      <h2>Woord</h2>
	          <p>explenation: explenation: explenation: explenation: explenation: explenation: explenation: explenation: explenation: explenation: </p>
	          <p> example example example example example example example example example</p>
	          <p>
	          	<a class="btn btn-inverse  btn-mini" href="#">Meer... &raquo;</a>
	          	<a class="btn btn-mini" href="#"><i class="icon-comment"></i> Reageer</a>
	          </p>
        </div>
	 */
	
	private String word;
	private String definition;
	private String example;
	
	public WordPanel(String word, String definition, String example){
		this.word = word;
		this.definition = definition;
		this.example = example;
		
		FlowPanel panel = new FlowPanel();
		panel.setStyleName("span4");
		
		HPanel h2panel = new HPanel(2);
		h2panel.add(new Label(word));
		panel.add(h2panel);
		
		PPanel definitionPanel = new PPanel();
		definitionPanel.add(new Label(definition));
		panel.add(definitionPanel);
		
		PPanel examplePanel = new PPanel();
		examplePanel.add(new Label(example));
		panel.add(examplePanel);
		
		CommentAnchor more = new CommentAnchor("Meer ...");
		more.setStyleName("btn");
		more.addStyleName("btn-inverse");
		more.addStyleName("btn-mini");
		
		CommentAnchor reageer = new CommentAnchor("Reageer");
		reageer.setStyleName("btn");
		reageer.addStyleName("btn-mini");

		reageer.addClickHandler(this);
		
		FlowPanel buttons = new FlowPanel();
		buttons.add(more);
		buttons.add(reageer);
		panel.add(buttons);
		
		initWidget(panel);
	}
	/*
	 * <p>
	          	<a class="btn btn-inverse  btn-mini" href="#">Meer... &raquo;</a>
	          	<a class="btn btn-mini" href="#"><i class="icon-comment"></i> Reageer</a>
	          </p>
	 */

	@Override
	public void onClick(ClickEvent event) {
		Window.alert("howdey");
	}

}
